<template>
    <div>
        <button @click="() => router.back()">返回</button>
        <p>展示详情页面</p>     
    </div>
    <div>名字,{{ item?.name }}</div>
    <div>邮箱,{{ item?.email }}</div>
    <div>ID,{{ item?.id }}</div>
</template>

<script setup lang='ts'>
import { ref } from 'vue';
import { data } from './list.json';
import { useRouter, useRoute } from 'vue-router';

const route = useRoute();
const router = useRouter();

const item = data.find(v => v.id === Number(route.params.id))
</script>

<style scoped></style>